<template>
	<view class="wrap bg-white">
		<view class="cu-bar bg-white">
			<u-button type="primary" class="no-border confirm-btn" @click="clear" >清空识别码</u-button>
			<view class="action" @click="toScan">
				<text class="cuIcon-scan" style="font-size: 56rpx;"></text>
			</view>
		</view>
		<view class="padding">
			<textarea  :focus="firstFocus" class="textarea"  placeholder="请扫识别码!" placeholder-style="font-size:28rpx" maxlength="-1"  v-model="cbarCode" @input="search" rows="20"/>
		</view>
		<u-card :title="title">
			<view class="" slot="body">
				<view class="u-border-bottom padding-top-sm" v-for="(item,index) in rdrList" :key="index">
					<view class=""> 
						<text class="text-bold">{{item.cinvname}}:</text></br>
						<text class="text-bold text-red">共 {{item.inum}}件 {{item.qty}}罐</text>|	
					</view>
				</view>
			</view>
		</u-card>
		
		<scroll-view class="scroll-list bg-white" scroll-y="true">
			<block v-for="(ietm,index) in list" :key="index">
				<u-form class="form" :model="ietm" ref="uForm" label-position="left">
					<u-form-item label="箱码:" prop="code" label-width="120" >
						<u-input v-model="ietm.code" :disabled="true" type="text" di maxlength="64"></u-input>
						<u-icon name="/static/common/img/delData.png" @click="delData(ietm.code)" color="#2979ff" class="rights" size="30"></u-icon>
					</u-form-item>
				</u-form>
			</block>
		</scroll-view>
		<view  style="height: 70px;" ></view>
		<view class="footer">
			<view class="confrim-btn padding padding-bottom-sm flex bg-white">
				<view>
					<text class="text-bold text-xl">扫描:</text>
					<text class="text-bold text-red text-xxl padding-left-sm">{{num}}(箱){{qty}}罐</text>
				</view>
				<u-button type="primary" class="no-border confirm-btn" @click="submit" >确认</u-button>
			</view>
		</view>
		<js-error mode="bottom" ref="jsError"></js-error>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				CustomBar: this.CustomBar,
				size:-1,
				num:0,
				qty:0,
				show:false,
				id:'',
				ccode:'',
				title:'',
				cbarCode:'',
				list:[],
				boxCount : 2,
				firstFocus: false,
				rdrList:[],
			}
		},
		onLoad(data) {
			this.id = data.id;
			this.ccode = data.ccode;
			this.title = data.ccode +" "+ (data.cusname==undefined?"":data.cusname);
			var _this = this;
			setTimeout(() => {
				this.firstFocus = true
			},0)
			this.loadBody();
		},
		methods: {
			/** 设置主表信息 */
			loadBody(){
				var query = {
					"code":this.ccode
				}
				var _this = this;
				this.$u.api.box.findRdrs09Inum(query).then(res=>{
					if(res.result == 'true'){
						_this.rdrList = res.data;
					}
				});
			},
			/** 扫码成功*/
			scCg(){
				console.log("=====testClick=====");
				let src = '/static/jeesite/cg.mp3';
				//实例化声音  
				const Audio = uni.createInnerAudioContext();
				Audio.autoplay = true;
				Audio.src = src; //音频地址  
				Audio.play(); //执行播放  
				Audio.onError((res) => {
					console.log(res.errMsg);
					console.log(res.errCode);
				});
				Audio.onPause(function() {
					console.log('end');
					Audio.destroy();
				});
			},
			/** 扫码失败*/
			scSb(){
				console.log("=====testClick=====");
				let src = '/static/jeesite/sb.mp3';
				//实例化声音  
				const Audio = uni.createInnerAudioContext();
				Audio.autoplay = true;
				Audio.src = src; //音频地址  
				Audio.play(); //执行播放  
				Audio.onError((res) => {
					console.log(res.errMsg);
					console.log(res.errCode);
				});
				Audio.onPause(function() {
					console.log('end');
					Audio.destroy();
				});
			},
			clear(){
				this.firstFocus = false;
				this.cbarCode = "";
				setTimeout(() => {
					this.firstFocus = true;
				},10)
			},
			blueCus(){
				this.firstFocus = false;
				setTimeout(() => {
					this.firstFocus = true;
				},10)
			},
			getData(code){
				var _this = this;
				if(code != '' && code.length == 24){
					var index = _this.list.findIndex((item) => item.code == code)
					if (index == -1) {
						var query = {
							"cbarcode":code
						}
						_this.$u.api.box.getBoxQty(query).then(res=>{
							if(res.result == 'true' && res.data.fhQuty == undefined){
								_this.scCg();
								var r = {
									code:code,
									quty:parseInt(res.data.quty)
								}
								_this.list.push(r);
								_this.num = parseInt(_this.num) + 1;
								_this.qty = parseInt(_this.qty) +  parseInt(res.data.quty);
							}else{
								_this.scSb();
							}
						});
					}else{
						_this.scSb();
					}
				}else if(code.indexOf("=") > -1 &&  code.split("=")[1] != '' && code.split("=")[1].length == 20){
					code = code.split("=")[1];
					var index = _this.list.findIndex((item) => item.code == code)
					if (index == -1) {
						_this.scCg();
						var res = {
							code:code
						}
						_this.list.push(res)
						_this.qty = parseInt(_this.qty) + 1;
					}else{
						_this.scSb();
					}
				}else{
					if(code != ''){
						this.scSb();
					}
				}
			},
			/** 扫码查询*/
			search(){
				this.firstFocus = false
				var _this = this;
				var code = this.$u.trim(_this.cbarCode.split("\n")[_this.cbarCode.split("\n").length - 1],'all');
				this.getData(code);
				setTimeout(() => {
					this.firstFocus = true
				},0)
			},
			/** 扫码 */
			toScan() {
				var _this = this;
				uni.scanCode({ 
					onlyFromCamera: true,
					success: function(res) {
						var code = res.result;
						this.getData(code);
					}.bind(this)
				});
			},
			//页面删除数据
			delData(code){
				var _this = this;
				var list = _this.list;
				for(var i = 0 ; i < list.length ; i++ ){
					if(list[i].code == code){
						if(list[i].code.length == 24){
							_this.num = parseInt(_this.num) - 1;
							_this.qty = parseInt(_this.qty) - parseInt(list[i].quty);
						}else if(list[i].code.length == 20){
							_this.qty = parseInt(_this.qty) - 1;
						}
						list.splice(i,1);
					}
				}
			},
			
			submit(){
				this.firstFocus = false
				var _this = this;
				var data = JSON.stringify(this.list);
				var parm = {
					"id":this.id,
					"data":data,
					"ccode":this.ccode,
				}
				var ix = 0;
				_this.rdrList.forEach(item => {
					ix = Number.parseInt(ix) + Number.parseInt(item.qty)
				})
				if(ix == this.qty){
					this.$u.api.box.saveRdr09(parm).then(res=>{
						this.cbarCode = "";
						if(res.result == 'true'){
							_this.list = [];
							_this.$u.toast(res.message);
						}else{
							_this.$refs.jsError.showError('',res.message,'error');
							return;
						}
					})
				}else{
					_this.$refs.jsError.showError('','请按照规定数量出库!','error');
				}
				setTimeout(() => {
					this.firstFocus = true
				},10)
			},
		}
	}
</script>

<style>
@import '../btdm.css';
.scroll-list {
	height: calc(100vh - var(--window-top) - var(--window-bottom) - 415px);
	width: 100%;
}
</style>
